/* Copyright (c) 2014, Google Inc. Please see the AUTHORS file for details. */
/* All rights reserved.  Use of this source code is governed by a BSD-style */
/* license that can be found in the LICENSE file. */

@import url("../../../packages/spark_widgets/common/spark_widget.css");

:host {
  position: absolute;
  left: 8px;
  right: 8px;
  bottom: 8px;
  box-shadow: 0 2px 10px 0 rgba(0, 0, 0, 0.16);
}

#container {
  /* A temporary hacky way to prevent the /deep/ rules related to flex layout
     leaking in from somewhere and overriding this setting. Those can be seen
     in the rules on this element in DevTools.
     TODO(ussuri): Fix properly. */
  display: none !important;
  height: 100%;
  background: #fafafa;
  border-radius: 2px;
  padding: 0 4px;
  box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26);
}

#container.showing {
  /* See the comment re: !important above.
     TODO(ussuri): Fix properly. */
  display: flex !important;
}

#queryText {
  display: inline;
  border: none;
  margin: 0;
  background-color: inherit;
}

#queryText:focus {
  outline: 0;
}
